<template>
  <div id="HomeNewdoc">
    <div class="headerp">创建新文档</div>
    <div class="content">
      <div class="selectMod">
        <label>选择文档模板：</label>
        <el-select v-model="selectedMod" placeholder="请选择" style="width: 400px">
          <el-option
              v-for="item in models"
              :key="item.id"
              :label="item.name"
              :value="item.id">
          </el-option>
        </el-select>
      </div>
      <div class="texts" v-for="(item,index) in texts" :key="index">
        <label><span>{{item.title}}</span><span>（{{item.grade}}）</span></label>
        <vue-ueditor-wrap v-model="item.content" :config="myConfig"></vue-ueditor-wrap>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: "HomeNewdoc",
    data(){
      return {
        models:[{id:'001',name:'XX可研报告01'},
                {id:'002',name:'XX可研报告02'},
                {id:'003',name:'XX可研报告03'}],
        selectedMod:'',
        myConfig: {
          serverUrl: `http://35.201.165.105:8000/controller.php`, // 上传功能的后端服务器接口地址
          UEDITOR_HOME_URL: '/ueditor/', // 你的UEditor资源存放的路径,相对于打包后的index.html
          autoHeightEnabled: false, // 编辑器是否自动被内容撑高
          autoFloatEnabled: false, // 工具栏是否可以浮动
          initialFrameHeight: 340, // 初始容器高度
          initialFrameWidth: '100%', // 初始容器高度
          enableAutoSave: true // 关闭自动保存
        },
        texts:[
          {title:'一、政策环境分析', grade:'一级标题', content:''},
          {title:'一、政策环境分析', grade:'一级标题', content:''},
          {title:'一、政策环境分析', grade:'一级标题', content:''}
        ]
      }
    }
  }
</script>

<style scoped>
  #HomeNewdoc{
    text-align: left;
    box-sizing: border-box;
    padding: 20px;
  }
  .headerp{
    width: 100%;
    box-sizing: border-box;
    padding: 20px;
    text-align: left;
    font-size: 20px;
    font-weight: bold;
    border-bottom: 1px solid #cfcfcf;
    margin-bottom: 20px;
  }
  .el-select-dropdown__item{
    text-align: left;
  }
  .selectMod{
    padding-bottom: 20px;
  }
  .texts label{
    width: 100%;
    padding: 20px 0;
    display: inline-block;
    font-size: 18px;
  }
  .texts label span:nth-child(1){
    font-weight: bold;
  }
</style>